<template>
	<view class="doctorInfo-wrap" v-if="doctorDetail">
		<view class="index-bg" style="height: 168rpx;"></view>
		<image class="doctorInfo-card-img" :src="doctorDetail.picture"></image>
		<view class="doctorInfo-card">
			<view class="doctorInfo-card-top">
				<view class="doctorInfo-card-info">
					<view class="doctorInfo-layer1">
						<view class="doctorInfo-layer1-box">
							<view class="doctorInfo-layer1-word2" style="margin-right: 32rpx;">{{ doctorDetail.doctorName }}</view>
						</view>
						<view class="doctorInfo-layer1-word4">{{ doctorDetail.departmentName }}&nbsp;|&nbsp;{{ jobGradeConfig[doctorDetail.jobGrade] }}</view>
						<view class="doctorInfo-layer1-word3">{{ doctorDetail.hospName }}</view>
					</view>
				</view>
			</view>
		</view>

		<view class="doctorInfo-brief">
			<u-title value="擅长方向"></u-title>
			<view class="doctorInfo-brief-info">{{ doctorDetail.goodsDirection }}</view>
		</view>
		
		<view class="doctorInfo-brief">
			<u-title value="医生简介"></u-title>
			<view class="doctorInfo-brief-info">{{ doctorDetail.intro }}</view>
		</view>
	</view>
</template>

<script>
import uniRate from '@/components/uni/uni-rate/uni-rate.vue';
import uTitle from '@/components/u-title/u-title.vue';
export default {
	components: {
		uTitle,
		uniRate
	},
	data() {
		return {
			doctorId: null,
			doctorDetail: null,
			hospital: {},
			jobGradeConfig: ['医师', '医士', '住院医师', '主治医师', '副主任医师', '主任医师', '药士', '药师', '主管药师', '副主任药师', '主任药师']
		};
	},
	onLoad(option) {
		this.doctorId = option.id ? option.id : null;

		if (option.scene) {
			this.doctorId = decodeURIComponent(option.scene);
		}
	},
	onShow() {
		this.queryDoctorDetail();
	},
	methods: {
		//医生详情
		queryDoctorDetail() {
			this.$api
				.queryDoctorDetail({
					params: {
						id: this.doctorId
					}
				})
				.then(res => {
					if (res.code == 200) {
						this.doctorDetail = res.result;
						this.hospital = res.result.hosptail;
					} else {
						uni.showToast({
							title: res.message,
							icon: 'none'
						});
					}
				});
		}
	}
};
</script>

<style lang="less" scoped>
@import './doctorDescribe.less';
</style>
